<template>
  <div>
    <!-- <div>初始值为：{{ count }}</div> -->
    <div>{{$store.getters.showNum}}</div>
    <button @click="add">+1</button>
    <button @click="addn">+n</button>
    <button @click="addasync">addAsync</button>
  </div>
</template>
<script>
import { mapState, mapMutations, mapGetters } from "vuex";
export default {
  data() {
    return {};
  },
  methods: {
    ...mapMutations(['addo','addone']),
    add() {
        this.addo()
        // this.$store.commit('add')
    },
    addn() {
      this.addone(10);
    },
    addasync(){
       this.$store.dispatch('addAsync')
    }
  },
  computed: {
    ...mapState(["count"]), //获取vuex中state中的count值，可在HTML中直接问使用
    ...mapGetters(['showNum'])
  },
};
</script>
